@CHARSET "UTF-8";
body {
    width: 100%;
}

input {
    width: 100%;
    height: 100%;
    background-color: lightskyblue;
}

#main {
    width: 60%;
    height: 90%;
    margin: auto;
}

#top {
    width: 100%;
    height: 5%;
}

#t_text {
    float: left;
    font-size: 130%;
    font-family: 幼圆;
}

#center {
    width: 100%;
    height: 20%;
    background-image: url("../img/banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.6;
    filter: alpha(opacity=60);
}

#left {
    width: 30%;
    height: 75%;
    float: left;
}

#top-bar {
    width: 95%;
    height: 8%;
    margin: auto;
    margin-top: 5px;
    border-radius: 3px;
    background-color: #5affff;
}

#top-bar-text {
    float: left;
    font-size: 18px;
    font-family: 等线;
    line-height: 34px;
    margin-left: 10px;
}

#top-bar-icon {
    width: 15%;
    height: 90%;
    float: right;
    z-index: 100;
    margin-top: 1px;
    background-size: 80%;
    background-image: url("../img/plus.png");
    background-repeat: no-repeat;
    background-position: center;
}

#top-bar-icon:hover {
    opacity: 0.6;
    filter: alpha(opacity=60);
}

#userInfo {
    float: right;
    width: 20%;
    height: 80%;
    font-family: 微软雅黑;
    color: inherit;
}

#vip {
    color: #ff2e68;
    margin-left: 1%;
    margin-right: 1%;
}

#vip:hover {
    text-shadow: 1px 1px 3px #ff6981;
}

#vip a {
    color: #ff2e68;
    text-decoration: none;
}

#userOut {
    float: right;
    width: 8%;
    height: 80%;
    text-align: center;
    font-size: 120%;
    color: white;
    border-radius: 1px;
    background-color: #7883ff;
}

#userOut:HOVER {
    background-color: #4d5eff;
}

.kinds{
    width: 90%;
    height: 7%;
    margin: auto;
    margin-top: 3px;
    border-radius: 2px;
    background-color: #47a7ff;
}

.kinds:hover{
    background-color: #3b69b5;
}

.kinds-text {
    float: left;
    font-size: 12px;
    font-family: 黑体;
    line-height: 30px;
    margin-left: 10px;
}

.kinds-edit {
    width: 15%;
    height: 90%;
    float: right;
    z-index: 100;
    margin-top: 1px;
    background-size: 80%;
    background-image: url("../img/edit.png");
    background-repeat: no-repeat;
    background-position: center;
}

.kinds-remove {
    width: 15%;
    height: 90%;
    float: right;
    z-index: 100;
    margin-top: 1px;
    background-size: 80%;
    background-image: url("../img/minus.png");
    background-repeat: no-repeat;
    background-position: center;
}

.kinds-edit:hover {
    opacity: 0.6;
    filter: alpha(opacity=60);
}

.kinds-remove:hover {
    opacity: 0.6;
    filter: alpha(opacity=60);
}

#show {
    width: 70%;
    height: 75%;
    float: right;
    margin-top: 10px;
    background-color: #aabfd2;
}

#show-top {
    height: 10%;
}

#show-top-text {
    width: 40%;
    float: left;
    font-size: 24px;
    color: #ffffff;
    padding-left: 10px;
    padding-top: 10px;
}

#show-top-remove {
    float: right;
    width: 8%;
    height: 50%;
    margin-top: 2%;
    margin-right: 25px;
    padding-top: 1%;
    text-align: center;
    border-radius: 2px;
    background-color: #7883ff;
}

#show-top-remove:hover {
    background-color: #3b69b5;
}

.website {
    width: 95%;
    height: 10%;
    margin: auto;
}

.website-num {
    width: 10%;
    height: 80%;
    float: left;
    margin-top: 0.85%;
    position: inherit;
    text-align: center;
    font-family: Consolas;
    line-height: 38px;
    background-color: #3b69b5;
}

.website-name {
    width: 20%;
    height: 80%;
    float: left;
    font-size: 14px;
    margin-top: 0.85%;
    font-family: 等线;
    line-height: 38px;
    background-color: #3b69b5;
}

.website-address {
    width: 50%;
    height: 80%;
    float: left;
    margin: auto;
    padding: auto;
    margin-top: 0.85%;
    text-align: center;
    line-height: 38px;
    font-family: Consolas;
    background-color: #3b69b5;
}

.website-address a {
    color: #051d5f;
    text-decoration: none;
}

.website-address:hover {
    text-shadow: 1px 1px 3px #0542d4;
}

.website-edit {
    width: 10%;
    height: 80%;
    float: left;
    margin-top: 0.85%;
    background-color: #3b69b5;

    z-index: 100;
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("../img/edit.png");
}

.website-edit:hover {
    opacity: 0.6;
    filter: alpha(opacity=60);
}

.website-remove {
    width: 10%;
    height: 80%;
    float: left;
    margin-top: 0.85%;
    background-color: #3b69b5;

    z-index: 100;
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("../img/minus.png");
}

.website-remove:hover {
    opacity: 0.6;
    filter: alpha(opacity=60);
}

#show-text {
    width: 60%;
    height: 40%;
    margin: auto;
    margin-top: 10%;
    font-size: 32px;
    font-family: "等线 Light";
    line-height: 60px;
    text-align: center;
}